<%-- 
    Document   : registration
    Created on : 10-Jun-2014, 11:13:24
    Author     : lucka
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<!--[if lt IE 7 ]> <html lang="en" class="no-js ie6 lt8"> <![endif]-->
<!--[if IE 7 ]>    <html lang="en" class="no-js ie7 lt8"> <![endif]-->
<!--[if IE 8 ]>    <html lang="en" class="no-js ie8 lt8"> <![endif]-->
<!--[if IE 9 ]>    <html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html lang="sk" class="no-js"> <!--<![endif]-->
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
        <!-- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">  -->
        <title>Vytvor si svoj životopis</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
        <meta name="description" content="Biography form" />
        <meta name="keywords" content="html5, css3, form, switch, animation, :target, pseudo-class" />
        <meta name="author" content="Codrops" />
        <link rel="shortcut icon" href="../favicon.ico"> 
        <link rel="stylesheet" type="text/css" href="../css/demo.css" />
        <link rel="stylesheet" type="text/css" href="../css/style.css" />

        <script  src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
            <script type="text/javascript">
            $(function() {
            var adddivschool = $('#addinputschool');
            
            var adddivemployment = $('#addinputemployment');
            
            var adddivskill = $('#addinputskill');
                    
            var adddivhobby = $('#addinputhobby');
            
            var i = 1;
            
            
             $('#addNewSchool').live('click', function() {
                $('<p>\
                     <p> \
                        <label for="text" class="youpasswd" > Názov školy: </label>\
                        <br>\
                        <input id="schoolName" name="schoolName' + i + '" required="required" type="text" placeholder="Gymnázium Ľudovíta Štúra Trenčín" /> \
                     </p>\
                     <p> \
                        <label for="text" class="youpasswd" > Študovaný obor: </label>\
                        <br>\
                        <input id="subjectOfStudy" name="subjectOfStudy' + i + '"  type="text" placeholder="Výpočtová technika" /> \
                     </p>\
                     <p> \
                        <label for="text" class="youpasswd" > Rok a mesiac nástupu: </label>\
                        <br>\
                        <input id="studiedFrom" name="studiedFrom' + i + '" required="required" type="text" placeholder="október 1995" /> \
                     </p>\
                     <p> \
                        <label for="text" class="youpasswd" > Rok a mesiac ukončenia: </2000>\
                        <br>\
                        <input id="studiedTo" name="studiedTo' + i + '"  type="text" placeholder="september 2004" /> \
                     </p>\
                     <p> \
                       <label for="text" class="youpasswd" > Poznámka: </label>\
                       <br>\
                       <input id="schoolNote" name="schoolNote' + i + '" required="required" type="text" placeholder="Poznámka." />\
                     </p>\
                </p><a href="#" id="remNewSchool">Remove</a></p>').appendTo(adddivschool);
            i++;

            return false;
            });

            var j = 1;
            
            $('#addNewEmployment').live('click', function() {
             $('<p>\
                    <p>\
                        <label for="text" class="youpasswd" > Názov zamestnávateľa: </label>\
                        <br>\
                        <input id="employmentName" name="employmentName' + j + '" required="required" type="text" placeholder="ESET Bratislava" />\
                    </p>\
                    <p>\
                        <label for="text" class="youpasswd" > Pracovná pozícia: </label>\
                        <br>\
                        <input id="employmentPosition" name="employmentPosition' + j + '" required="required" type="text" placeholder="programátor" /> \
                       </p\
                    <p> \
                        <label for="text" class="youpasswd" > Rok a mesiac nástupu: </label>\
                        <br>\
                        <input id="employmentFrom" name="employmentFrom' + j + '" required="required" type="text" placeholder="december 2004" /> \
                    </p>\
                       <p> \
                        <label for="text" class="youpasswd" > Rok a mesiac odchodu: </label>\
                        <br>\
                        <input id="employmentTo" name="employmentTo' + j + '"  type="text" placeholder="marec 2008" /> \
                    </p>\
                        <p> \
                        <label for="text" class="youpasswd" > Poznámka: </label>\
                        <br>\
                        <input id="employmentNote" name="employmentNote' + j + '" required="required" type="text" placeholder="Poznámka." />\
                    </p>\
                </p><a href="#" id="remNewEmployment">Remove</a></p>').appendTo(adddivemployment);
            j++;

            return false;
            });

            var k = 1;          
            
              $('#addNewSkill').live('click', function() {
                $('<p>\
                     <p>\
                        <label for="text" class="youpasswd" > Názov zručnosti: </label>\
                        <br>\
                        <input id="skill" name="skill' + k + '" required="required" type="text" placeholder="Programming in Java" /> \
                     </p>\
                </p><a href="#" id="remNewSkill">Remove</a></p>').appendTo(adddivskill);
            k++;

            return false;
            });
            
            var l = 1;
            
              $('#addNewHobby').live('click', function() {
                $('<p>\
                    <p>\
                        <label for="text" class="youpasswd" > Názov hobby: </label>\
                        <br>\
                        <input id="hobby" name="hobby' + l + '" required="required" type="text" placeholder="geocaching" /> \
                    </p>\
                </p><a href="#" id="remNewHobby">Remove</a></p>').appendTo(adddivhobby);
            l++;

            return false;
            });
            
            
            $('#remNewEmployment').live('click', function() {
            if( j > 0 ) {
            $(this).parents('p').remove();
            j--;
            }
            return false;
            });
            
            
             $('#remNewSchool').live('click', function() {
            if( i > 0 ) {
            $(this).parents('p').remove();
            i--;
            }
            return false;
            });
            
            $('#remNewSkill').live('click', function() {
            if( k > 0 ) {
            $(this).parents('p').remove();
            k--;
            }
            return false;
            });
            
            $('#remNewHobby').live('click', function() {
            if( l > 0 ) {
            $(this).parents('p').remove();
            l--;
            }
            return false;
            });
            
            });

        </script>

    </head>
    <body>
        <div class="container">
            <header>
                <h1>CV expresne a jednoducho</h1>
            </header>
            
            <section>
                <div id="container_demo" >
                    <div id="wrapper">
                        
                        <form  action = "${pageContext.request.contextPath}/biography/createBiography" method="post" autocomplete="on"> 
                             <h1>Osobné údaje</h1> 
                                <p> 
                                    <label for="username" class="uname"  > Tituly pred menom: </label>
                                    <br>
                                    <input id="beforeNameAcademicTitles" name="beforeNameAcademicTitles" type="text" placeholder="prof. MUDr." />
                                </p>
                                <p> 
                                    <label for="text" class="youpasswd" > Meno: </label>
                                    <br>
                                    <input id="firstName" name="firstName" required="required" type="text" placeholder="Ján " /> 
                                </p>
                                <p> 
                                    <label for="text" class="youpasswd" > Priezvisko: </label>
                                    <br>
                                    <input id="lastName" name="lastName" required="required" type="text" placeholder="Novák" /> 
                                </p>
                                <p> 
                                    <label for="text" class="youpasswd" > Tituly za menom: </label>
                                    <br>
                                    <input id="afterNameAcademicTitles" name="afterNameAcademicTitles"  type="text" placeholder="CSC" /> 
                                </p>
                                <p> 
                                    <label for="text" class="youpasswd" > Dátum narodenia: </label>
                                    <br>
                                    <input id="dayOfBirth" name="dayOfBirth" required="required" type="text" placeholder="1.1.1980" /> 
                                </p>
                                <p> 
                                    <label for="text" class="youpasswd" > Telefónne čísla (jednotlivé čísla oddeľujte čiarkou): </label>
                                    <br>
                                    <input id="phoneNumbers" name="phoneNumbers" required="required" type="text" placeholder="0901222333, 432 123 456, 0904 333 222" /> 
                                </p>
                                <p> 
                                    <label for="text" class="youpasswd" > Emailové adresy (jednotlivé adresy oddeľujte čiarkou): </label>
                                    <br>
                                    <input id="emails" name="emails" required="required" type="text" placeholder="jannovak@mailprovider.com, jannovak@freemail.com" /> 
                                </p>
                                <h1>Kontaktná adresa</h1>
                                <p> 
                                    <label for="text" class="youpasswd" > Ulica, číslo: </label>
                                    <br>
                                    <input id="street" name="street" required="required" type="text" placeholder="Lesná, 7" /> 
                                </p>
                                <p> 
                                    <label for="text" class="youpasswd" > PSČ: </label>
                                    <br>
                                    <input id="postcode" name="postcode" required="required" type="text" placeholder="61300" /> 
                                </p>
                                <p> 
                                    <label for="text" class="youpasswd" > Mesto: </label>
                                    <br>
                                    <input id="city" name="city" required="required" type="text" placeholder="Brno" /> 
                                </p>
                                
                                
                                <h1>Vzdelanie</h1>
                                <h3>Poznámka: začnite najvyšším vzdelaním.<h3>
                                <br>
                                <div id="addinputschool">
                                    <p>
                                        <p> 
                                         <label for="text" class="youpasswd" > Názov školy: </label>
                                         <br>
                                         <input id="schoolName" name="schoolName" required="required" type="text" placeholder="Gymnázium Ľudovíta Štúra Trenčín" /> 
                                        </p>
                                        <p> 
                                         <label for="text" class="youpasswd" > Študovaný obor: </label>
                                         <br>
                                         <input id="subjectOfStudy" name="subjectOfStudy"  type="text" placeholder="Výpočtová technika" /> 
                                        </p>
                                        <p> 
                                         <label for="text" class="youpasswd" > Rok a mesiac nástupu: </label>
                                         <br>
                                         <input id="studiedFrom" name="studiedFrom" required="required" type="text" placeholder="január 1995" /> 
                                        </p>
                                        <p> 
                                         <label for="text" class="youpasswd" > Rok a mesiac ukončenia: </2000>
                                         <br>
                                         <input id="studiedTo" name="studiedTo"  type="text" placeholder="september 2000" /> 
                                        </p>
                                        <p> 
                                        <label for="text" class="youpasswd" > Poznámka: </label>
                                        <br>
                                        <input id="schoolNote" name="schoolNote" required="required" type="text" placeholder="Poznámka." />
                                        </p>
                                        
                                        <a href="#" id="addNewSchool">Pridať ďalší záznam</a>
                                     </p>
                                </div>
                                
                                <h1>Priebeh zamestnaní</h1>
                                <h2>Poznámka: začnite posledným zamestnaním.</h2>
                                <br>
                                <div id="addinputemployment">
                                    <p>
                                        <p> 
                                         <label for="text" class="youpasswd" > Názov zamestnávateľa: </label>
                                         <br>
                                         <input id="employmentName" name="employmentName" required="required" type="text" placeholder="ESET Bratislava" /> 
                                        </p>
                                        <p> 
                                         <label for="text" class="youpasswd" > Pracovná pozícia: </label>
                                         <br>
                                         <input id="employmentPosition" name="employmentPosition" required="required" type="text" placeholder="programátor" /> 
                                        </p>
                                        <p> 
                                         <label for="text" class="youpasswd" > Rok a mesiac nástupu: </label>
                                         <br>
                                         <input id="employmentFrom" name="employmentFrom" required="required" type="text" placeholder="apríl 2004" /> 
                                        </p>
                                        <p> 
                                         <label for="text" class="youpasswd" > Rok a mesiac odchodu: </label>
                                         <br>
                                         <input id="employmentTo" name="employmentTo"  type="text" placeholder="marec 2008" /> 
                                        </p>
                                         <p> 
                                         <label for="text" class="youpasswd" > Poznámka: </label>
                                         <br>
                                         <input id="employmentNote" name="employmentNote" required="required" type="text" placeholder="Poznámka." />
                                         </p>
                                         
                                         <a href="#" id="addNewEmployment">Pridať ďalší záznam</a>
                                     </p>
                                </div>
                                 
                                <h1>Jazykové znalosti</h1>
                                <p>
                                 Vyberte jazyk:
                                 <select name = "language1">
                                    <option value="prazdny">Prázdny</option>
                                    <option value="anglicky">Anglický</option>
                                    <option value="nemecky">Nemecký</option>
                                    <option value="spanielsky">Španielský</option>
                                    <option value="francuzsky">Francúzsky</option>
                                    <option value="taliansky">Talianský</option>
                                    <option value="cesky">Český</option>
                                    <option value="madarsky">Maďarský</option>
                                    <option value="rusky">Ruský</option>
                                  </select> 
                               
                                 Úroveň ovládania:
                                 <select name = "level1">
                                     <option value="prázdny">Prázdny</option>
                                     <option value="A1">A1</option>
                                     <option value="A2">A2</option>
                                     <option value="B1">B1</option>
                                     <option value="B2">B2</option>
                                     <option value="C1">C1</option>
                                     <option value="C2">C2</option>
                                 </select>
                                </p>
                                Vyberte jazyk:
                                 <select name = "language2">
                                    <option value="prazdny">Prázdny</option>
                                    <option value="anglicky">Anglický</option>
                                    <option value="nemecky">Nemecký</option>
                                    <option value="spanielsky">Španielský</option>
                                    <option value="francuzsky">Francúzsky</option>
                                    <option value="taliansky">Talianský</option>
                                    <option value="cesky">Český</option>
                                    <option value="madarsky">Maďarský</option>
                                    <option value="rusky">Ruský</option>
                                  </select> 
                               
                                 Úroveň ovládania:
                                 <select name = "level2">
                                     <option value="prázdny">Prázdny</option>
                                     <option value="A1">A1</option>
                                     <option value="A2">A2</option>
                                     <option value="B1">B1</option>
                                     <option value="B2">B2</option>
                                     <option value="C1">C1</option>
                                     <option value="C2">C2</option>
                                 </select>
                                </p>
                                
                                 Vyberte jazyk:
                                 <select name = "language3">
                                    <option value="prazdny">Prázdny</option>
                                    <option value="anglicky">Anglický</option>
                                    <option value="nemecky">Nemecký</option>
                                    <option value="spanielsky">Španielský</option>
                                    <option value="francuzsky">Francúzsky</option>
                                    <option value="taliansky">Talianský</option>
                                    <option value="cesky">Český</option>
                                    <option value="madarsky">Maďarský</option>
                                    <option value="rusky">Ruský</option>
                                  </select> 
                               
                                 Úroveň ovládania:
                                 <select name = "level3">
                                     <option value="prázdny">Prázdny</option>
                                     <option value="A1">A1</option>
                                     <option value="A2">A2</option>
                                     <option value="B1">B1</option>
                                     <option value="B2">B2</option>
                                     <option value="C1">C1</option>
                                     <option value="C2">C2</option>
                                 </select>
                                </p>
                                
                                 Vyberte jazyk:
                                 <select name = "language4">
                                     <option value="prazdny">Prázdny</option>
                                    <option value="anglicky">Anglický</option>
                                    <option value="nemecky">Nemecký</option>
                                    <option value="spanielsky">Španielský</option>
                                    <option value="francuzsky">Francúzsky</option>
                                    <option value="taliansky">Talianský</option>
                                    <option value="cesky">Český</option>
                                    <option value="madarsky">Maďarský</option>
                                    <option value="rusky">Ruský</option>
                                  </select> 
                               
                                 Úroveň ovládania:
                                 <select name = "level4">
                                     <option value="prázdny">Prázdny</option>
                                     <option value="A1">A1</option>
                                     <option value="A2">A2</option>
                                     <option value="B1">B1</option>
                                     <option value="B2">B2</option>
                                     <option value="C1">C1</option>
                                     <option value="C2">C2</option>
                                 </select>
                                </p>
                                
                                 Vyberte jazyk:
                                 <select name = "language5">
                                     <option value="prazdny">Prázdny</option>
                                    <option value="anglicky">Anglický</option>
                                    <option value="nemecky">Nemecký</option>
                                    <option value="spanielsky">Španielský</option>
                                    <option value="francuzsky">Francúzsky</option>
                                    <option value="taliansky">Talianský</option>
                                    <option value="cesky">Český</option>
                                    <option value="madarsky">Maďarský</option>
                                    <option value="rusky">Ruský</option>
                                  </select> 
                               
                                 Úroveň ovládania:
                                 <select name = "level5">
                                     <option value="prázdny">Prázdny</option>
                                     <option value="A1">A1</option>
                                     <option value="A2">A2</option>
                                     <option value="B1">B1</option>
                                     <option value="B2">B2</option>
                                     <option value="C1">C1</option>
                                     <option value="C2">C2</option>
                                 </select>
                                </p>
                                
                                <h1>Iné zručnosti:</h1>
                                <br>
                                 <div id="addinputskill">
                                    <p>
                                        <p> 
                                           <label for="text" class="youpasswd" > Názov zručnosti: </label>
                                           <br>
                                           <input id="skill" name="skill" required="required" type="text" placeholder="Programming in Java" /> 
                                        </p>
                                        <a href="#" id="addNewSkill">Pridať ďalší záznam</a>
                                    </p>
                                </div>
                              
                                <h1>Koníčky:</h1>
                                <br>
                                 <div id="addinputhobby">
                                    <p>
                                        <p>
                                            <label for="text" class="youpasswd" > Názov hobby: </label>
                                            <br>
                                            <input id="hobby" name="hobby" required="required" type="text" placeholder="geocaching" /> 
                                        </p>
                                        <a href="#" id="addNewHobby">Pridať ďalší záznam</a>
                                    </p>
                                </div>
                                
                                <p class="login button"> 
                                    <input type="submit" value="Uložiť" />
				</p>
                        </form>
                    </div>
                </div>
            </section>
        </div> 
    </body>
</html>
